<template>
  <div id="Estab">
      <el-container >
        <el-container>
        <el-header style="text-align: center; border: 1px solid #eee; background-color: #cccccc">
          <span color="#fff"><h3>模板表单填写</h3></span>
        </el-header>
        <el-menu
                          :default-active="activeIndex2"
                          class="el-menu-demo"
                          mode="horizontal"
                          @select="handleSelect"
                          background-color="#808080"
                          text-color="#fff"
                          active-text-color="#77ff77">
                          <el-menu-item index="1"><router-link to="/EstablishProj" >我要立项！</router-link></el-menu-item>
                          <el-submenu index="2">
                            <template #title>查看项目</template>
                            <el-menu-item index="2-1"><router-link to="/MyProj" >我的科研项目</router-link></el-menu-item>
                            <el-menu-item index="2-2"><router-link to="/PermittedProj" >浏览正在进行中项目</router-link></el-menu-item>
                            <el-submenu index="2-3">
                               <template #title>申请加入项目</template>
                               <el-menu-item index="2-3-1"><router-link to="/MyApply" >查看我的申请</router-link></el-menu-item>
                               <el-menu-item index="2-3-2">提交加入项目申请</el-menu-item>
                            </el-submenu>
                                <el-menu-item index="2-4"><router-link to="/Leader">发给我的申请</router-link></el-menu-item>
                          </el-submenu>
                        </el-menu>
        <el-main style="text-align: center; border: 1px solid #eee;" id="bg">
            <br/>
            <br/>
            <br/>
            <br/>
            <h4>项目名称：</h4>
            <el-input v-model="ProName" placeholder="项目名称" style="width:500px"></el-input>
            <br/>
            <br/>
            <br/>
            <h4>启动单位：</h4>
            <el-input v-model="Unit" placeholder="单位名" style="width:500px"></el-input>
            <br/>
            <br/>
            <br/>
            <br/>
                        <br/>
                        <br/>
            <el-button @click="submit" type="primary">提交项目</el-button>
        </el-main>
      </el-container>
          </el-container>
   </div>
</template>

<script>
import http from '../utils/req.js'
export default {
  name: 'Estab',
  data() {
    return{
        ProName:'',
        Unit:'',
        username:''
    }
  },
  methods:{
    submit:function(){
        http
        .post('/EstablishProj',{
            ProName:this.ProName,
            Unit:this.Unit,
            username:sessionStorage.getItem("username")
        })
        .then(successResponse=>{
            if(successResponse.data.code === 200){
                alert("Your project form have been submitted successfully,now you can track it in 我的科研项目");
            }
        })
        .catch(failResponse=>{
                alert("There's something wrong with your form or our system,we feel sorry about it that you need to try again later");
        })
    }
  }
}
</script>
